// # Pinia Store，管理设备、告警等所有状态数据
// 将共享数据集中存储在一个全局的“仓库”（Store）中，任何组件都可以：
// ​​读取​​仓库中的数据（如 deviceTotal）
// ​​调用方法​​更新数据（如 fetchDashboardData()）
// ​​自动响应​​数据变化（数据更新时，所有用到它的组件会自动刷新）

import { defineStore } from 'pinia'//Pinia的核心API，用于创建Store
import {onMounted, ref}   from 'vue'       // Vue的响应式API，使数据变成“响应式”
//import{ getDevices,getAlarms } from '@/api/deviceApi'

//创建一个名为 device的Store，其他组件通过 useDeviceStore()使用它。
export const useDeviceStore = defineStore('device', () => {
    //状态
    const deviceTotal = ref(667) // 设备总数，初始值为0
    const onlineDevices = ref(667) // 在线设备数
    //const alarmsList = ref([]) // 告警列表，初始为空数组
    let socket = null // WebSocket连接对象
    //初始化websocket连接
    const connectionWebSocket = () => {
        socket = new WebSocket('ws://localhost:8082/ws')
        socket.onmessage = (event) => {
            const data = JSON.parse(event.data)
            deviceTotal.value = data.total
            onlineDevices.value = data.online
            console.log("实时数据更新:", data)
        }
        socket.onclose = () => {
            console.log('WebSocket连接已关闭，尝试重新连接...')
            setTimeout(connectionWebSocket, 3000) // 3秒后重连
        }
    }
    //在组件成功挂载到页面后，
    // 自动调用 connectionWebSocket 函数建立 WebSocket 连接，确保连接操作在 DOM 就绪后执行
    onMounted(() => {
        connectionWebSocket()
    })
    // //这些状态相当于Store的“私有变量”，只有通过 return暴露出去的才能被外部访问。
    return {deviceTotal, onlineDevices}
})
    // //定义方法
    // const fetchDashboardData = async () => {
    //     try{
    //         //修改 ref()创建的值需要用 .value。
    //         const reponse = await getDevices()//调用api，从go后端获取数据
    //         deviceTotal.value = reponse.data.total//更新设备总数
    //         onlineDevices.value = reponse.data.online
    //         // alarmList.value = response.data.alarms    // 更新告警列表
        
    //     }catch(error){  
    //         console.error('获取数据失败',error);
    //     }
    // }
//})